<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <link href="/static/css/bootstrap.css" rel="stylesheet">
    <script type="text/javascript" src="/static/js/jquery-3.2.1.js"></script>
</head>
<body>
<center>
    <h3>添加</h3>
    <form action="/main/add" method="post" id="form">
        场馆:<select name="sid">
        <option value="0">-请选择-</option>
    </select>
        项目类型:<select name="tid">
        <option value="0">-请选择-</option>
    </select>
        场地:<select name="aid">
        <option value="0">-请选择-</option>
    </select>
        <br>
        <input type="button" value="+" onclick="addTime()">
        <span>
            开始时间:<input type="text" name="timeList[0].startTime" required>
            结束时间:<input type="text" name="timeList[0].endTime" required>
            价格:<input type="text" name="timeList[0].price" required><br>
        </span>
        <div id="rid">

        </div>
        <input type="submit" value="提交" onclick="addMain()">
    </form>
</center>
</body>
<script>
    $(function () {
        $.get(
            "/main/getStadium",
            function (list) {
                for (var i in list) {
                    $("[name='sid']").append("<option value='"+list[i].sid+"'>"+list[i].sname+"</option>")
                }
            }
        )
        $.get(
            "/main/getType",
            function (list) {
                for (var i in list) {
                    $("[name='tid']").append("<option value='"+list[i].tid+"'>"+list[i].tname+"</option>")
                }
            }
        )
        $.get(
            "/main/getArea",
            function (list) {
                for (var i in list) {
                    $("[name='aid']").append("<option value='"+list[i].aid+"'>"+list[i].aname+"</option>")
                }
            }
        )
    })
    var i = 1
    function addTime() {
        $("#rid").append(`<span>
            开始时间:<input type="text" name="timeList[`+i+`].startTime" required>
            结束时间:<input type="text" name="timeList[`+i+`].endTime" required>
            价格:<input type="text" name="timeList[`+i+`].price" required>
            <input type="button" value="-" onclick="delTime(this)"><br>
        </span>`)
        i++;
    }
    function delTime(obj) {
        $(obj).parent().remove();
        i--;
    }

</script>
</html>